<template>
    <div id="system">
        <div class="system-title">系统消息编辑</div>
        <!-- <div class="system-item">
            <div class="system-item-title"></div>
            <el-input v-model="nickname" placeholder="输入昵称"></el-input>
        </div>
        <div class="system-title">系统参数编辑</div>
        <el-form ref="formData" :model="formData" label-width="130px">
            <el-form-item label="昵称：">
                <el-input v-model="nickname" placeholder="输入昵称" @keyup.enter.native="search"></el-input>
            </el-form-item>
            <el-form-item label="昵称：">
                <el-input v-model="nickname" placeholder="输入昵称" @keyup.enter.native="search"></el-input>
            </el-form-item>
        </el-form> -->

        <el-form :label-position="labelPosition" label-width="20px">
            <el-form-item label="" class="system-item">
                <el-input
                    type="textarea"
                    :autosize="{ minRows: 3, maxRows: 7}"
                    placeholder="请输入内容"
                    maxlength="200"
                    v-model="content">
                </el-input>
                <el-button type="primary" @click="sureSendData">发送</el-button>
            </el-form-item>
        </el-form>
        <el-dialog
            title="提示"
            :visible.sync="dialogVisible"
            width="30%">
            <span>确认发送吗？</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="onSureClick">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    name: 'user-man-detail',
    data () {
        return {
            dialogVisible: false,
            labelPosition: 'right',
            content: ''
        }
    },
    created () {
    },
    mounted () {
    },
    methods: {
        handleRemove (file, fileList) {
            console.log(file, fileList)
        },
        handlePictureCardPreview (file) {
            this.imageUrl = file.url
            this.dialogVisible = true
        },
        onSureClick () {
            this.dialogVisible = false
            this.sendMessage(this.del_station_id)
        },
        sureSendData () {
            if (this.content === '') {
                this.$message('编辑内容不能为空')
                return
            }
            this.dialogVisible = true
        },
        // 更新系统消息
        sendMessage () {
            let _this = this
            let data = 'content=' + this.content
            // let data = {
            //     'params': params
            // }
            this.$api.system.sendMsg(data, res => {
                // 隐藏加载动画
                // this.$vux.loading.hide()
                if (res.code === 200) {
                    _this.$message('修改成功')
                } else {
                    _this.$message(res.msg)
                }
            })
        }
    }
}
</script>

<style lang="less" scoped>
    #system {
        width: 640px;
        height: 100%;
        padding: 10px 0;
        .system-title{
            font-size: 22px;
            margin-bottom: 40px;
        }
        .system-item{
            position: relative;
            margin-bottom: 30px!important;
        }
        .el-form-item{
            display: inline-block;
            margin-bottom: 0;
            width: 480px;
        }
        .el-button{
            // position: absolute;
            // top: 0;
            // right: -100px;
            margin-top: 20px;
            // display: block;
        }
        .el-form-item__content{
            height: 30px;
        }
        .el-form-item__label{
            height: 30px;
        }
        .btn-height{
            width: 720px;
            padding: 10px 0 20px 0;
        }
        .ui-img{
            display: block;
            padding: 8px 48px;
        }
        .ui-img-title{
            display: block;
            line-height: 36px;
            font-size: 18px;
        }
    }
</style>
